<!DOCTYPE html>
<html lang="zh">
<head>
	<th:block th:include="include :: header('卡片列表')" />
</head>
<body class="gray-bg">

    <div class="wrapper wrapper-content animated fadeInRight">
        <form id="form-user-add" class="form-horizontal">
            <h4 class="form-header h4">
                <a class="btn btn-primary single" onclick="goSelect()">
                    我要借书 <i class="fa fa-mail-forward"></i>
                </a>
            </h4>
        </form>

        <div class="row" id="loanList" style="margin-left: -5px">
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <script>
    $(function() {
        let view = $('#loanList');

        $.ajax({
            url:ctx + 'admin/loan/listNotPageByUserId',
            type:'post',
            dataType:'json',
            success: function(result) {
                result.rows.map( item => {
                    let str = '';

                    if (item.loanStatus == 1) {
                        str =  '<span class="label label-primary pull-right" style="background-color: #510080; font-size: 15px; cursor: pointer" onclick="addReturn('+ item.loanId +')">正常借阅</span>\n';
                    } else if (item.loanStatus == 2){
                        str ='<span class="label label-primary pull-right" style="background-color: #ad0404; font-size: 15px; cursor: pointer" onclick="addReturn('+ item.loanId +')">逾期未还</span>\n';
                    } else if (item.loanStatus == 3){
                        str = '<span class="label label-primary pull-right" style="background-color: #008018; font-size: 15px">正常归还</span>\n';
                    } else if (item.loanStatus == 4){
                        str = '<span class="label label-primary pull-right" style="background-color: #ee9108; font-size: 15px">逾期已还</span>\n';
                    }

                    view.append('<div class="col-sm-4">\n' +
                        '<div class="ibox"><div class="ibox-title">\n' + str +
                        '<h5>'+ item.libBook.name +' (编号：'+ item.libBook.bookNo +')</h5></div>\n' +
                        '<div class="ibox-content"><h4>书本信息: </h4><div>\n' +
                        '<div class="row  m-t-sm"><div class="col-sm-4"><img class="img img-md" src="'+ item.libBook.images +'"/></div>'+
                        '<div class="col-sm-6">'+ item.libBook.introduce +'</div></div>\n' +
                        '<h4></h4><div>\n' +
                        '<div class="form-header h4"></div>'+
                        '<div class="row  m-t-sm">\n' +
                        '<div class="col-sm-4"><div class="font-bold">借阅日</div>'+ item.loanTime +'</div>\n' +
                        '<div class="col-sm-4"><div class="font-bold">预期归还日</div>'+ item.preReturnTime +'</div>\n' +
                        '<div class="col-sm-4 text-right"><div class="font-bold">实际归还日</div>'+ item.praReturnTime +'</div></div>\n' +
                        '</div></div>');
                });
            }
        });
    });

    function goSelect(){
        var url = ctx + 'admin/loan/selectBook';
        $.modal.openTab("选择图书", url);
    }

    function addReturn(loanId){
        $.modal.confirm("确定归还图书吗？", function() {
            $.ajax({
                url: ctx + 'admin/loan/addReturn',
                type:'post',
                data:{loanId: loanId},
                dataType:'json',
                beforeSend: function () {
                    $.modal.loading("正在处理中，请稍候...");
                    $.modal.disable();
                },
                success: function(result) {
                    if (typeof callback == "function") {
                        callback(result);
                    }
                    $.operate.saveReload(result);
                }
            });
        });
    }
    </script>
</body>
</html>
